/* pages/home/home-nav/personal-overview/personal-overview.wxss */
.personal-overview{
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  margin-top: 2.5%;
}

.personal-overview-page{
  width: 92%;
  padding: 2%;
  border-radius: 5px;
  border: 4rpx #ccc solid;
  margin-bottom: 5%;
}

.personal-overview-row{
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: center;
  width: 100%;
  margin-top: 5%;
}

.personal-overview-col{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
}

.personal-overview-chart{
  width: 100%;
  flex: 1;
}

.personal-overview-table{
  display: grid;
  margin-bottom: 20rpx;
  width: 100%;
  grid-template-columns: 2fr 2fr 2fr ;
  gap: 10rpx;
}

.personal-overview-table-content{
  display: flex; /* 使用 Grid 布局 */
  justify-content: center;
  align-items: center;
  width:100%;
  height: 100rpx;
  border-radius: 10rpx;
  box-shadow: 0 0 5rpx;
  flex-direction: column;
}

.personal-overview-content{
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
}

.personal-overview-taken{
  width: 1vw;
  height: 1vw;
  background-color: #ccc;
  border-radius: 50%;
}

.personal-overview-taken-active{
  width: 1vw;
  height: 1vw;
  background-color: #317bc3;
  border-radius: 50%;
}